import React, {
    useMemo
} from 'react';

import PropTypes from 'prop-types'

import { h0 } from '../../../common/fp'
import dayjs from 'dayjs'//时间格式转换为想要的样式

import './DepartDate.css'



export default function DepartDate(props) {

    const {
        time,
        onClick,
    } = props;

    const h0OfDepart = h0(time);//去掉小时分钟秒毫秒
    const departDate = new Date(h0OfDepart);

    const departDateString = useMemo(() => {
        return dayjs(h0OfDepart).format('YYYY-MM-DD')
    }, [h0OfDepart])


    //之所以不用memo优化，因为数据不止来自props,比如h0
    const isToday = h0OfDepart === h0();//h0(不传入参数既是当前时刻)

    const weekString = '周'
        + ['日', '一', '二', '三', '四', '五', '六'][departDate.getDay()]
    +(isToday?'(今天)':'')


    return (
        <div className="depart-date" onClick={onClick}>
            <input type="hidden" name="date" value={departDateString} />
            {departDateString}<span className="depart-week">{weekString}</span>
        </div>
    )
}

DepartDate.propTypes = {
    time: PropTypes.number.isRequired,
    onClick:PropTypes.func.isRequired,
}